<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2021/5/24
  Time: 9:11
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>


<html>
<head>
    <title>信息展示页面</title>
</head>
<body>
    <form action="../main/select">
        <input type="hidden" name="pageIndex" value="1" />
        名称:<input typee="text" name="name" value="#{name}" />
        编号:<input type="text" name="number" value="#{number}"/>
        <input type="submit" value="查询" />
    </form>
    <table border="1px red solid" cellpadding="0" cellspacing="0">
        <th>宠物信息展示</th>
        <tr>
            <td>id</td>
            <td>petName</td>
            <td>petBreed</td>
            <td>petSex</td>
            <td>birthday</td>
            <td>description</td>
        </tr>
        <c:forEach items="${pageInfo.list}" var="pet">
            <tr>
                <td>${pet.petId}</td>
                <td>${pet.petName}</td>
                <td>${pet.petBreed}</td>
                <td>${pet.petSex}</td>
                <td>${pet.birthday}</td>
                <td>${pet.description}</td>
            </tr>
        </c:forEach>
    </table>
    <div class="row">
        <div class="col-sm-5">
            <div class="dataTables_info" id="datatable-responsive_info"
                 role="status" aria-live="polite">共${pageInfo.total}条记录
                ${pageInfo.pageNum}/${pageInfo.pages}页</div>
        </div>
        <div class="col-sm-7">
            <div class="dataTables_paginate paging_simple_numbers"
                 id="datatable-responsive_paginate">
                <ul class="pagination">
                    <c:if test="${pageInfo.hasPreviousPage}">
                        <li class="paginate_button previous"><a
                                href="javascript:page_nav(document.forms[0],1);"
                                aria-controls="datatable-responsive" data-dt-idx="0"
                                tabindex="0">首页</a>
                        </li>
                        <li class="paginate_button "><a
                                href="javascript:page_nav(document.forms[0],${pageInfo.prePage});"
                                aria-controls="datatable-responsive" data-dt-idx="1"
                                tabindex="0">上一页</a>
                        </li>
                    </c:if>
                    <c:if test="${pageInfo.hasNextPage}">
                        <li class="paginate_button "><a
                                href="javascript:page_nav(document.forms[0],${pageInfo.nextPage});"
                                aria-controls="datatable-responsive" data-dt-idx="1"
                                tabindex="0">下一页</a>
                        </li>
                        <li class="paginate_button next"><a
                                href="javascript:page_nav(document.forms[0],${pageInfo.lastPage});"
                                aria-controls="datatable-responsive" data-dt-idx="7"
                                tabindex="0">最后一页</a>
                        </li>
                    </c:if>
                </ul>
            </div>
        </div>
    </div>

</body>
</html>
<script src="${pageContext.request.contextPath }/statics/js/rollpage.js"></script>